<template>
  <div>
    {{ countTime }}
    <button @click="start">开始定时器</button>
    <button @click="pause">暂停定时器</button>
    <button @click="resume">继续定时器</button>
  </div>
</template>

<script>
// import { useIntervalFn } from '@vueuse/core'
// import { ref } from 'vue'

import { useCountDown } from '@/compositions'

export default {
  setup () {
    // const countTime = ref(0)
    // const { pause, resume } = useIntervalFn(() => {
    //   if (countTime.value <= 0) {
    //     pause()
    //     return
    //   }
    //   countTime.value--
    // }, 1000)
    // const start = () => {
    //   countTime.value = 60
    //   resume()
    // }
    // return {
    //   start,
    //   pause,
    //   resume,
    //   countTime
    // }
    const { countTime, start, pause, resume } = useCountDown(5)
    return {
      countTime,
      start,
      pause,
      resume
    }
  }
}
</script>
